<template>
  <view class="interal-page">
    <view class="search-bar b-w">
      <u-search placeholder="请输入搜索关键词" v-model="parm.keyword" @clear="clearSearch" @custom="searchList" @search="searchList"></u-search>
    </view>
    <view class="intention-list" v-for="item in listData" :key="item.id">
      <intention-item :info="item"></intention-item>
    </view>
    <view class="more">
      <u-loadmore :status="status" />
    </view>
  </view>
</template>

<script>
import intentionItem from './components/intentionItem'
export default {
  components: {
    intentionItem,
  },
  data() {
    return {
      parm: {
        pageNo: 1,
        pageSize: 10,
        keyword: '',
      },
			status: 'loading',
      listData: [],
    }
  },
  onLoad() {
    this.getList()
  },
	onReachBottom() {
		this.parm.pageNo++
		this.getList()
	},
  methods: {
		clearSearch() {
			this.parm.keyword = ''
			this.parm.pageNo = 1
			this.status = 'loading'
			this.getList()
		},
		searchList(e) {
			this.parm.keyword = e
			this.parm.pageNo = 1
			this.status = 'loading'
			this.getList()
		},
    getList() {
			if (this.status == 'nomore') return
      this.$request('/talentMatchIntention/talentMatchIntentionPage', this.parm).then((res) => {
        if (this.parm.pageNo === 1) this.listData = []
        this.listData = [...this.listData, ...res.result.records]
				this.status = this.listData.length >= res.result.total ? 'nomore': 'loading'
      })
    },
  },
}
</script>

<style scoped lang="scss">
.interal-page {
	padding-top: 108rpx;
}
.intention-list {
  margin: 20rpx;
  box-sizing: border-box;
}
.search-bar {
  position: fixed;
  top: 88rpx;
  /*  #ifdef MP-WEIXIN*/
  top: 0;
  /*  #endif  */
  left: 0;
  right: 0;
  padding: 20rpx;
  height: 106rpx;
  box-sizing: border-box;
  z-index: 10;
  box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.1);
}
.more {
  padding-bottom: 40rpx;
}
</style>
